<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="../../res/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../../res/css/common/font-awesome.min.css" media="all">
		<link rel="stylesheet" href="../../res/layui-config/css/app.css" media="all">
		<title>分店零售管理</title>
    </script>
	</head>
	<body>
		<div class="kit-table">
				<form class="layui-form" lay-filter="kit-search-form">
						<!-- 左上角的两个按钮 -->
				        <div class="kit-table-header">
				            <div class="kit-search-btns">
				                <a href="javascript:;" data-action="add" class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe608;</i> 新增</a>
				            </div>
				            <div class="kit-search-inputs">
				                <div class="kit-search-keyword">
				                    <input type="text" class="layui-input" id="serach-one" placeholder="请输入会员名.." onKeyUp="lockInput(this,'serach-two')"/>
				                    <button lay-submit lay-filter="search"><i class="layui-icon">&#xe615;</i></button>
				                </div>
				                <div class="kit-search-more" id="kit-search-more">更多筛选<i class="layui-icon">&#xe61a;</i></div>
				            </div>
				        </div>
						<!-- 搜索扩展工具条 -->
						<div class="kit-search-mored layui-anim layui-anim-upbit">
				          <div class="kit-search-body">
							  <div class="layui-form-item">
				              <label class="layui-form-label">会员名</label>
				                   <div class="layui-input-block">
				                        <input type="text" name="menName" id="serach-two" placeholder="请输入会员名" autocomplete="off" class="layui-input" onKeyUp="lockInput(this,'serach-one')">
				                   </div>
				         </div>
				         <div class="layui-form-item">
				              <label class="layui-form-label">店铺名</label>
				                   <div class="layui-input-block">
				                        <input type="text" name="comName" id="serach-two" placeholder="请输入店铺名" autocomplete="off" class="layui-input" onKeyUp="lockInput(this,'serach-one')">
				                   </div>
				         </div>
				         <div class="layui-form-item">
				              <label class="layui-form-label">销售总数量</label>
				                   <div class="layui-input-block" style="width: 120px;">
				                        <input type="text" name="bsAmount" id="serach-two" placeholder="请输入零售数量" autocomplete="off" class="layui-input" onKeyUp="lockInput(this,'serach-one')">
				                   </div>
				                   <div class="layui-input-block" style="width: 120px;">
				                        <input type="text" name="bsAmount2" id="serach-two" placeholder="请输入零售数量" autocomplete="off" class="layui-input" onKeyUp="lockInput(this,'serach-one')">
				                   </div>
				         </div>
				         
		                <div class="layui-form-item">
		                    <div class="layui-inline">
		                        <label class="layui-form-label">销售总金额</label>
		                        <div class="layui-input-block">
			                        <div class="layui-input-inline" style="width: 100px;">
			                            <input type="text" name="priceMin" placeholder="￥" autocomplete="off" class="layui-input" maxlength="6" onKeyUp="amount(this)">
			                        </div>
			                        <div class="layui-form-mid">-</div>
			                        <div class="layui-input-inline" style="width: 100px;">
			                            <input type="text" name="priceMax" placeholder="￥" autocomplete="off" class="layui-input" maxlength="6" onKeyUp="amount(this)">
			                        </div>
		                        </div>
		                    </div>
		                </div>
		            </div>
		            <div class="kit-search-footer">
		                <button type="reset" class="layui-btn layui-btn-sm layui-btn-primary kit-btn reset-btn">重置</button>
		                <button lay-submit lay-filter="search" class="layui-btn layui-btn-sm kit-btn">确定</button>
		            </div>
		        </div>
		    </form>
				
			<!-- 操作按钮 -->
		    <div class="kit-table-body">
		        <table id="demo" lay-filter="demo"></table>
		        <script type="text/html" id="barDemo">
		            <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
		        </script>
		    </div>
		</div>
		<div id="detailDiv" style="display: none;">
			<table id="myTable" class="layui-table"
			lay-data="{ url:'../../branchSaleDetail/query.action', page:true, id:'cxDetailTable'}"
			lay-filter="myTableDemo">
			<thead>
				<tr>
					<th lay-data="{field:'bsdId',align:'center',width:250}">零售明细编号</th>
					<th lay-data="{field:'drugName', align:'center',width:183}">药品名</th>
					<th lay-data="{field:'bsdAmount', align:'center',width:100}">药品数量</th>
					<th lay-data="{field:'bsdPrice', align:'center',width:130}">药品单价</th>
					<th lay-data="{field:'bsdTotal', align:'center',width:130}">小计</th>
					<th lay-data="{field:'optimestr', align:'center',width:190,sort: true}">操作时间</th>
				</tr>
			</thead>
		</table>
		</div>
		
		<!-- 修改页面 -->
		<script type="text/html" id="edit-tpl">
		    <div style="margin:10px">
		        <form class="layui-form" action="" lay-filter="form-edit">
		            <input type="hidden" name="bsId" value="{{d.rowdata.bsId}}" />
		            <div class="layui-form-item">
		                <label class="layui-form-label">会员名</label>
		                <div class="layui-input-block">
		                    <input type="text" name="menId" required lay-verify="required" value="{{d.rowdata.menId}}" placeholder="请输入会员名" autocomplete="off" class="layui-input">
		                </div>
		            </div>
					<div class="layui-form-item">
		                <label class="layui-form-label">店铺名</label>
		                <div class="layui-input-block">
		                    <input type="text" name="comId" required lay-verify="required" value="{{d.rowdata.comId}}" placeholder="请输入店铺名" autocomplete="off" class="layui-input">
		                </div>
		            </div>
					<div class="layui-form-item">
		                <label class="layui-form-label">销售总数量</label>
		                <div class="layui-input-block">
		                    <input type="text" name="bsAmount" required lay-verify="required" value="{{d.rowdata.bsAmount}}" placeholder="请输入销售总数量" autocomplete="off" class="layui-input">
		                </div>
		            </div>
		            <div class="layui-form-item">
		                <label class="layui-form-label">销售总金额</label>
		                <div class="layui-input-block">
		                    <input type="text" name="bsPrice" required lay-verify="required" value="{{d.rowdata.bsPrice}}" placeholder="请输入销售总金额" autocomplete="off" class="layui-input">
		                </div>
		            </div>
					
		            <div class="layui-form-item" style="display:none;">
		                <div class="layui-input-block">
		                    <button class="layui-btn" lay-submit lay-filter="formEdit">立即提交</button>
		                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
		                </div>
		            </div>
		        </form>
		    </div>
		</script>
		<script src="../../res/js/common/jquery-1.11.2.min.js"></script>
		<script>
			//搜索框同步输入
			function lockInput(obj,id){
				$("#"+id).val($(obj).val());
			}
		</script>
		<script src="../../res/layui/layui.all.js"></script>
		<script>
			//显示表格数据
		    layui.use(['table','upload','laydate'], function() {
		        var table = layui.table,
		            $ = layui.jquery,
		            layer = layui.layer,
		            form = layui.form,
		            laytpl = layui.laytpl,
		            laydate=layui.laydate;
		        
		        
		        laydate.render({
		        	elem:'#date'
		        });
		        laydate.render({
		        	elem:'#time'
		        });
		        var tableIns = table.render({
		            elem: '#demo',
		            url: '../../branchSale/query.action',
		            height: 'full-50', //容器高度
		            page: true,
		            id: 'demo',
		            cols: [
		                [{checkbox: true,fixed: true},
		                {field: 'bsId',title: '销售ID', width: 160,align: 'center'},
		                {field: 'comName',title: '店铺名',width: 170,align: 'center'},
		                {field: 'menName',title: '会员名',width: 110,align: 'center'},
		                {field: 'bsAmount',title: '销售总数量',width: 100,align: 'center'},
		                {field: 'bsPrice',title: '销售总金额',width: 110,align: 'center'},
		                {field: 'optimeStr',title: '操作时间',width: 175,align: 'center'},
		                {fixed: 'right',title: '操作',width: 179.5,align: 'center',toolbar: '#barDemo'}]
		            ],
		            done: function(res, curr, count) {
		                $("[date-fixed='isva']").children().each(function(){
		                	if($(this).text()==1){
		                		$(this).text("有效");
		                	}else if($(this).text()==0){
		                		$(this).text("无效");
		                	}
		                });
		            },
		            loading: true,
		        });
		        
		        //监听搜索表单提交
		        form.on('submit(search)', function(data) {
		            //带条件查询
		            tableIns.reload({
		                where: data.field,
		                page: { curr:1 }
		            });
		            $('.kit-search-mored').hide();
		            return false;
		        });
		        
		        //渲染 修改和增加弹出层
			    function showlayer(d){
			    	laytpl($('#edit-tpl').html()).render(d,function(html) {
	                    layer.open({
	                        type: 1,
	                        title: '表单',
	                        content: html,
	                        area: ['800px', '430px'],
	                        btn: ['提交', '重置', '取消'],
	                        yes: function(index, layero) {
	                            editIndex = index;
	                            $('form[lay-filter="form-edit"]').find('button[lay-submit]').click();
	                        },
	                        btn2: function(index, layero) {
	                            $('form[lay-filter="form-edit"]').find('button[type="reset"]').click();
	                            return false;
	                        },
	                        success: function() {
	                            form.render(null, 'form-edit');
	                        }
	                    });
	                    upload();
	                });
			    }
		        
		        //监听工具条按钮点击
		        table.on('tool(demo)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
		            var data = obj.data; //获得当前行数据
		            var layEvent = obj.event; //获得 lay-event 对应的值
		            var tr = obj.tr; //获得当前行 tr 的DOM对象
		
		            if (layEvent === 'detail') { //查看
		                layer.open({
		    				type: 1	 //此处以iframe举例
		    				,title: '查看详情'
		    					,area: ['1000px','490px']
		    				,offset: 'auto'
		    				,content:$('#detailDiv')
		    				,success: function(layero){
		    					table.reload('cxDetailTable', {
		    						page: {
		    							curr: 1 //重新从第 1 页开始
		    						}
			    					,where: {
			    						bsId: data.bsId,
			    					}
		    					});
		    				},end : function() {
		    					//弹框关闭的回调函数
		    					$("#detailDiv").hide();
		    				}
		    			});
		            
		            } else if (layEvent === 'del') { //删除
		                layer.confirm('真的删除行么', function(index) {
		                	layer.close(index);
		                    update("../../branchSale/addSale.action",{"bsId":data.bsId,"isva":"0"});
		                });
		            } else if (layEvent === 'edit') { //编辑
		                var d = {
		                	rowdata: data,
		                };
		                showlayer(d);
		            }
		        });
		        
		        //表单渲染
		        form.render(null, 'kit-search-form');
		        //更多筛选点击事件
		        $('#kit-search-more').on('click', function() {
		            $('.kit-search-mored').toggle();
		        });
		        var editIndex;
		        
		        //增加和修改弹出层   提交按钮点击事件
		        form.on('submit(formEdit)', function(data) {
                	if ($("[name=memPictrue]").val()=="") {
                		layer.msg('未上传文件');
                    	$("#fileBtn").html('<span style="color:red"><i class="layui-icon">&#xe67c;</i>选择文件</span>');
                    	form.render(null, 'form-edit');
                    	return false;
                    }
                	update("../../branchSale/addSale.action",data.field);
                	if (close) editIndex && layer.close(editIndex); //关闭弹出层
                	return false;
		        });
		        
		        //增加、批量删除 按钮点击事件
		        $('.kit-search-btns').children('a').off('click').on('click', function() {
		            var $that = $(this),
		                action = $that.data('action');
		            switch (action) {
		            	//点击的是 增加按钮
		                case 'add':
		                    var d = {
		                		//替换增加页面文本框内出现的undefine
		                        rowdata: {
		                        	bsId: '',comId: '',menId: '',bsAmount: '',bsPrice: '',optimeStr: '',
		                        },
		                    };
		                    //渲染
		                    laytpl($('#edit-tpl').html()).render(d,
		                        function(html) {
		                            layer.open({
		                                type: 2,
		                                title: '增加零售订单',
		                                shadeClose: true,
		                                shade: false,
		                                maxmin: true, //开启最大化最小化按钮
		                                area: ['900px', '450px'],
		                                content: 'branchSaleAdd.html'
		                                ,end:function(){
		                                	table.reload('demo', {
		                    					page: {
		                    						curr: 1 //重新从第 1 页开始
		                    					}
		                    				});
		                                }
		                            });
		                });
		                    
		                //点击的是 批量删除按钮
		                case 'del-bulk':
		                    var d = table.checkStatus('demo');
		                    if (d.data.length === 0) {
		                        return;
		                    }
		                    var data = d.data,
		                        names = [],
		                        ids = [];
		                    layui.each(data, function(index, item) {
		                        names.push(item.menName);
		                        ids.push(item.menId);
		                    });
		                    layer.confirm('真的删除行么', function(index) {
		                    	layer.close(index);
		                    	update("../../branchSale/bulkUpdate.action",ids);
			                });
		                    break;
		            }
		        });
		    });
		    
		    //增加、修改、删除、批量删除 都是用的这一个方法
		    function update(url,data){
		    	$.ajax({
		    		url: url,
                    type:'post',//method请求方式，get或者post
                    cache: false,//同步
                    dataType:'json',//预期服务器返回的数据类型
                    data: JSON.stringify(data),//表格数据序列化
                    contentType: "application/json; charset=utf-8",
                    success:function(mes){//res为相应体,function为回调函数
                    	$(".layui-laypage-btn")[0].click();//当前表格刷新
                        if(mes.status==1){ 
                        	var close = true;//有弹出层时是关闭弹出层 false不关闭
	                        $("#res").click();//调用重置按钮将表单数据清空
                        } 
                        layer.msg(mes.msg);
                    },
                   	error:function(){layer.alert('数据异常，请稍后重试！！！',{icon:5});}
                 });
		    }
		    var comId="";
		    $(function(){
		    	getSession();
		    })
		    
		    function getSession(){
				var admin = null;
				$.ajax({ 
		        	url:"../../admin/getSession.action",
	                type:'post',
	                async:false,
	                dataType:'json',
	                success:function(mes){
	                	if (mes!=null && mes!="") {
	                		comId = mes.comId;
						} else {
							location.href = "../admin/login.html";
						}
	                },
	                error: function(){
	                	location.href = "../admin/login.html";
	                }
	        	});
				return admin;
			}
		</script>
	</body>
</html>